import 'dart:html';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(ListDetails());
}

/*
  列表详情页面
 */
class ListDetails extends StatefulWidget {
  String name;
  ListDetails({this.name});
  @override
  _ListDetailsState createState() => _ListDetailsState();
}

class _ListDetailsState extends State<ListDetails> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('${widget.name} 的个人简介'),
          centerTitle: true,
          backgroundColor: Colors.black,
          leading: IconButton(
              icon: Icon(Icons.arrow_back),
              onPressed: () {
                Navigator.pop(context);
              }),
          elevation: 2.0,
        ),
        body: ShowDetail(name: widget.name),
      ),
    );
  }
}

class ShowDetail extends StatefulWidget {
  String name;
  ShowDetail({this.name});
  @override
  _ShowDetailState createState() => _ShowDetailState();
}

class _ShowDetailState extends State<ShowDetail> {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        ConstrainedBox(
          constraints: BoxConstraints(
              minWidth: double.infinity, //宽度尽可能大
              minHeight: 80.0 //最小高度为50像素
              ),
          child: DecoratedBox(
            decoration: BoxDecoration(color: Colors.white),
            child: Padding(
              padding: const EdgeInsets.all(15.0),
              child: Row(
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(right: 10.0),
                    child: Image.network(
                      'https://avatars2.githubusercontent.com/u/20411648?s=460&v=4',
                      width: 50.0,
                      height: 50.0,
                    ),
                  ),
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Text(
                        widget.name,
                        style: TextStyle(
                            fontSize: 20, fontWeight: FontWeight.bold),
                      ),
                      Text("微信号：${widget.name}",
                          style: TextStyle(color: Colors.black26)),
                    ],
                  ),
                ],
              ),
            ),
          ),
        ),
        Container(
          padding: EdgeInsets.all(10),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              ListTile(
                leading: Icon(Icons.payment),
                tileColor: Colors.white,
                title: Text('支付'),
                trailing: Icon(
                  Icons.keyboard_arrow_right,
                  color: Colors.black26,
                  size: 20.0,
                ),
              ),
              ListTile(
                leading: Icon(Icons.favorite),
                tileColor: Colors.white,
                title: Text('收藏'),
                trailing: Icon(
                  Icons.keyboard_arrow_right,
                  color: Colors.black26,
                  size: 20.0,
                ),
              ),
              ListTile(
                leading: Icon(Icons.settings),
                tileColor: Colors.white,
                title: Text('设置'),
                trailing: Icon(
                  Icons.keyboard_arrow_right,
                  color: Colors.black26,
                  size: 20.0,
                ),
              ),
            ],
          ),
        ),
        Padding(
          padding: const EdgeInsets.all(15.0),
          child: ConstrainedBox(
            constraints: BoxConstraints.expand(height: 55.0),
            child: OutlineButton.icon(
              icon: Icon(Icons.messenger_outline),
              label: Text("发消息"),
            ),
          ),
        ),
      ],
    );
  }

  final makeCard = Card(
    child: Container(
      child: ListTile(
        tileColor: Colors.white,
        leading: Image.network(
          'https://avatars2.githubusercontent.com/u/20411648?s=460&v=4',
          width: 50.0,
          height: 50.0,
        ),
        title: Text('_content[index]'),
        trailing: Icon(
          Icons.keyboard_arrow_right,
          color: Colors.black26,
          size: 20.0,
        ),
        subtitle: Text(
          'hello ',
          style: TextStyle(color: Colors.black26),
        ),
      ),
    ),
  );
}
